<template>
    <el-dialog v-model="visible" title="插入文章尾" width="500">
        <el-input type="textarea" ref="fileNameInputRef" v-model="text" placeholder="请输入文件名"
                  @keydown.enter="handleSubmit"></el-input>
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="visible=false;text='';">取消</el-button>
                <el-button type="primary" @click="handleSubmit">插入</el-button>
            </div>
        </template>
    </el-dialog>
</template>

<script setup>
import {computed, defineProps, defineEmits, ref} from "vue";
import {useSystemStore} from "../store/index.js";

const systemStore = useSystemStore();
const props = defineProps({
    open: Boolean
})
const emit = defineEmits(['update:open', 'insertDownFooter']);

const visible = computed({
    get() {
        if (props.open) {
            init();
        }
        return props.open;
    },
    set(value) {
        emit('update:open', value);
    }
})

const text = ref('');

/** 初始化方法 */
async function init() {
    text.value = systemStore.insertDownFooterText;
}

/** 提交方法 */
async function handleSubmit() {
    if (text.value === '') return;
    emit('insertDownFooter', text.value);
    text.value = '';
    visible.value = false;
}
</script>